<template>
  <div class="inter">
    <loading v-bind:state="state"></loading>
    <div class="inter_t">
      <p>积分兑换</p>
      <p>￥{{data.integral}}</p>
    </div>
    <qcell textLeft="当前状态" :textRight="data.state"></qcell>
    <qcell textLeft="商品" :textRight="data.des"></qcell>
    <qcell textLeft="说明" :textRight="data.explain"></qcell>
    <qcell textLeft="时间" :textRight="data.created"></qcell>
    <qcell textLeft="交易单号" :textRight="data.oddNum"></qcell>
    <link-opinion></link-opinion>
  </div>
</template>
<script type="text/ecmascript-6">
  import LinkOpinion from '@/components/common/LinkOpinion';

  export default {
    name: `integraldetail`,
    components: {LinkOpinion},
    data() {
      return {
        state: true,
        data: {}
      };
    },
    created() {
      const ID = this.$route.query.id;
      this.$Spread.getvoucherDetail(ID).then(res => {
        console.log(res);
        this.data = res;
        this.state = false;
      }, () => {
        this.state = false;
      });
    },
    methods: {}
  };
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
  @import "../../assets/stylus/main.styl"
  .inter_t {
    background: white;
    flex-x();
    height: vw(52px);
    padding: vw(15px);
    box-sizing: border-box;
    border-bottom: 2px solid #f5f5f5
    & p:first-child {
      word(18px, #000)
    }
    & p:last-child {
      word(20px, #000)
    }
  }
</style>
